require('./PagePaymanagesub.styl');

const reactMixin = require('react-mixin');
const Actions = require('./actions');
const Store = require('./store');
const { Group, TextField, SelectField, Button, Boxs, Toast } = SaltUI;
const { HBox, Box } = Boxs;
import Addpersonfield from 'components/addpersonfield'
const Fileselect = require('components/fileselect')
const classNames = require("classnames")

var formName = [{ label: '所属支付计划', name: 'payplan', mark: 0 }, { label: "支付总金额", name: "proTotalMoney", mark: 1 }, { label: '支付节点', name: 'paypointer', mark: 0 }, { label: '支付比例', name: 'payProportion', mark: 1 }, { label: "支付金额", name: 'payMoney', mark: 1 }, { label: '扣款比例', name: 'Perdeductions', mark: 1 }, { label: "扣款金额", name: 'deductionsMoney', mark: 1 }, { label: '扣款事由', name: 'deductions', mark: 1 }]
class Paymanagesub extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            approvers: [],
            upfileName: [],
            deductions: "",
            Perdeductions: '',
            deductionsMoney: "",
            unionid: []
        };
        this.currNum = 0;
        this.content = {};
        this.approvers = [];
        this.appUnionid = [];
        this.csrUnionid = [];
    }
    handleTextChange(name, newValue) {
        if (name == 'payplan') {
            this.currNum = newValue.value;
            this.setState({
                folder_id: this.state.folderId[newValue.value],
                proTotalMoney: this.state.payTotalMoneyAll[newValue.value]//支付总金额
            });
            Actions.check(newValue.text, this.state.paypointeAll[newValue.value])
        }
        if (name == 'paypointer') {
            this.setState({
                payProportion: this.state.payProportionAll[this.currNum][newValue.value],
                payMoney: this.state.payMoneyAll[this.currNum][newValue.value],//支付金额
            });
            this.payPointerCurrNum = newValue.value;
        }
        if (name == 'Perdeductions') {//扣款金额
            var deductions_money = null;
            if (newValue.indexOf("%") != -1) {
                deductions_money = (parseInt(this.state.proTotalMoney) * parseInt(newValue) / 100).toString()
                if (deductions_money.indexOf("万元") == -1)//金额单位
                    deductions_money += "万元"
            } else if (newValue == "") {
                deductions_money = ""
            }
            this.setState({
                deductionsMoney: deductions_money
            });
        }
        this.setState({
            [name]: newValue
        });
    }
    handleAddpersonCb(names) {//审批人获取
        this.content.spr = names
    }
    handleAddpersonCs(names) {//抄送人获取
        this.content.csr = names
    }
    handleAddpersonUnionid(unionids) {
        this.content.approvers_id = unionids
    }
    handlecsrUnionid(unionids) {
        this.content.cc_list_id = unionids
    }
    formdata() {//表单提交
        var formdata = {};
        var boo = false;
        for (var i = 0; i < formName.length; i++) {
            var reg = new RegExp("^(\\d|[1-9]\\d|100)%$")
            if (formName[i].name == "Perdeductions" && (this.state[formName[i].name] && !reg.test(this.state[formName[i].name]))) {
                boo = false;
                Toast.show({
                    type: 'error',
                    content: "请填写100以内的百分比数字,例如：65%",
                });
                return;
            }
            if (!(formName[i].name == "Perdeductions" || formName[i].name == "deductions" || formName[i].name == "deductionsMoney") && !this.state[formName[i].name]) {
                boo = false;
                Toast.show({
                    type: 'error',
                    content: formName[i].label + "不能为空",
                });
                return;
            } else {
                boo = true;
                formdata[formName[i].name] = this.state[formName[i].name]["text"] ? this.state[formName[i].name].text : this.state[formName[i].name];
            }
        }
        if (!this.state.path_name) {
            Toast.show({
                type: 'error',
                content: `文件存储区域不能为空`
            });
            return;
        } else if (!this.refs.fileselect.fileData || this.refs.fileselect.fileData.length == 0) {
            Toast.show({
                type: 'error',
                content: `附件不能为空`
            });
            return;
        }
        if (!this.content.spr || this.content.spr.length < 2) {
            boo = false;
            Toast.show({
                type: 'error',
                content: "审批人为2人"
            })
        }
        if (boo) {
            this.content.upfileName = JSON.stringify(this.refs.fileselect.fileData)
            this.content = Object.assign(this.content, { proNum: this.state.proNumAll[this.currNum], proj_webhook: this.state.webhookAll[this.currNum], payplanId: this.state.process_id[this.currNum], folder_id: this.state.folder_id })
            if (this.payPointerCurrNum == 0) {
                Actions.updataApproval(this.state.process_id[this.currNum], { payPoniterStatus: '发起计划' })
            } else {
                Actions.updataApproval(this.state.process_id[this.currNum], { payPointerCurrNum: 1 })
            }
            formdata.payProportion = this.state.payProportion
            if (this.props.pagedata) {//若为变更申请则pagedata不为空
                Actions.sendForm({ node: formName, data: formdata, pagedata: this.props.pagedata, edit: this.props.edit }, this.content, boo);
            } else {
                Actions.sendForm({ node: formName, data: formdata }, this.content);
            }
        }
    }
    setPathName(path_name){
        this.setState({path_name})
    }
    //获取文件组件数据
    // getFileData(type,data){
    //     this.content.upfileName = JSON.stringify(data)
    // }

    render() {
        let t = this
        return (
            <div className="paymanagesub myform">
                <Group.List >
                    <SelectField
                        label="所属支付计划"
                        placeholder="请选择"
                        options={t.state.proNameAll}
                        value={t.state.payplan}
                        readOnly={this.props.edit}
                        onSelect={t.handleTextChange.bind(t, 'payplan')}
                    />
                </Group.List>
                <Group.List >
                    <TextField
                        label="支付总金额"
                        value={t.state.proTotalMoney}
                        readOnly={true} />
                    <SelectField
                        label="支付节点"
                        placeholder="请选择"
                        options={t.state.paypointeCurr}
                        value={t.state.paypointer}
                        readOnly={this.props.edit}
                        onSelect={t.handleTextChange.bind(t, 'paypointer')}
                    />
                    <TextField
                        label="支付比例"
                        value={t.state.payProportion}
                        readOnly={true}
                    />
                    <TextField
                        label="支付金额"
                        value={t.state.payMoney}
                        readOnly={true}
                    />
                </Group.List>
                <Group.List >
                    <TextField
                        label="扣款比例"
                        placeholder="百分比数字,例如：65% (非必填)"
                        value={t.state.Perdeductions}
                        readOnly={this.props.edit}
                        onChange={t.handleTextChange.bind(t, 'Perdeductions')}
                    />
                    <TextField
                        label="扣款金额"
                        placeholder="(非必填)"
                        value={t.state.deductionsMoney}
                        readOnly={true}
                    />
                    <TextField
                        label="扣款事由"
                        placeholder="(非必填)"
                        value={t.state.deductions}
                        readOnly={this.props.edit}
                        onChange={t.handleTextChange.bind(t, 'deductions')}
                    />
                </Group.List>
                {/* <Group.List >
                    <TextField
                        label="支付方财务"
                        value={t.state.payFinance}
                        readOnly={this.props.edit}
                        onChange={t.handleTextChange.bind(t, 'payFinance')}
                    />
                    <TextField
                        label="乙方收款人"
                        value={t.state.partyBPayee}
                        readOnly={this.props.edit}
                        onChange={t.handleTextChange.bind(t, 'partyBPayee')}
                    />
                </Group.List> */}
                <Fileselect
                    ref='fileselect'
                    upfileName={this.state.upfileName}
                    proName={this.state.payplan}
                    edit={this.props.edit}
                    folder_id={this.state.folder_id}
                    setPathName={this.setPathName.bind(this)}
                    process_folder={true}//是不是需要审批通过才存储文件
                    pathdata={this.state.pathdata}
                    path_name={this.state.path_name}
                    message="payment-payreq"
                // getFileData={this.getFileData.bind(this)}
                />
                <Group.List>
                    <Addpersonfield
                        label={this.props.pagedata ? "审批人" : "发送给：监理 -- 甲方"}
                        cb={t.handleAddpersonCb.bind(t)}
                        union={t.handleAddpersonUnionid.bind(t)}
                        approvers={t.state.approvers}
                        approvers_id={t.state.approvers_id}
                        maxLength="2" />
                </Group.List>
                <Group.List>
                    <Addpersonfield label="抄送人"
                        cb={t.handleAddpersonCs.bind(t)}
                        union={t.handlecsrUnionid.bind(t)}
                        approvers={t.state.cc_list}
                        approvers_id={t.state.cc_list_id}
                        maxLength="10" />
                </Group.List>
                <Button type="primary" className="submitBtn" onClick={t.formdata.bind(t)}>提交</Button>
            </div>
        );
    }

    componentWillMount() {
        var pagedata = {};
        if (this.props.pagedata) {
            pagedata.proName = this.props.pagedata.proName;
            pagedata.proNum = this.props.pagedata.proNum;
            pagedata.change_id = this.props.pagedata.process_id;
            pagedata.folder_id = this.props.pagedata.folder_id;
            this.content.spr = this.props.pagedata.approvers;
            this.content.csr = this.props.pagedata.cc_list;
            this.content.approvers_id = this.props.pagedata.approvers_id;
            this.content.cc_list_id = this.props.pagedata.cc_list_id;
            this.content.proj_webhook = this.props.pagedata.proj_webhook;
            for (let i = 0; i < this.props.pagedata.node_info.length; i++) {
                if (this.props.pagedata.node_info[i].name == "上传附件") {
                    try {
                        pagedata.upfileName = JSON.parse(this.props.pagedata.node_info[i].value);
                        this.otherData.upfileName = pagedata.upfileName;
                        pagedata.path_name = pagedata.upfileName[0].selected_folder_pathname;
                    } catch (e) {
                        pagedata.upfileName = [];
                    }
                }
                for (let j = 0; j < formName.length; j++) {
                    if (this.props.pagedata.node_info[i].name == formName[j].label) {
                        if (formName[i].mark == 0) {
                            pagedata[formName[j].name] = { value: 0, text: this.props.pagedata.node_info[i].value };
                        } else {
                            pagedata[formName[j].name] = this.props.pagedata.node_info[i].value;
                        }
                    }
                }
            }
        }
        Object.assign(this.state, pagedata)
    }

    componentDidMount() {
        Actions.fetch()
    }

    componentWillReceiveProps(nextProps) {
        if (nextProps.pagedata.approvers && nextProps.pagedata.approvers instanceof Array)
            this.setState({
                approvers: nextProps.pagedata.approvers,
                approvers_id: nextProps.pagedata.approvers_id,
            });
        else if (nextProps.pagedata.approvers && typeof nextProps.pagedata.approvers == 'string')
            this.setState({
                approvers: [nextProps.pagedata.approvers],
                approvers_id: [nextProps.pagedata.approvers_id]
            });
        if (nextProps.pagedata.cc_list && nextProps.pagedata.cc_list instanceof Array)
            this.setState({
                cc_list: nextProps.pagedata.cc_list,
                cc_list_id: nextProps.pagedata.cc_list_id
            });
        else if (nextProps.pagedata.cc_list && typeof nextProps.pagedata.cc_list == 'string')
            this.setState({
                cc_list: [nextProps.pagedata.cc_list],
                cc_list_id: [nextProps.pagedata.cc_list_id]
            })
    }

    shouldComponentUpdate(nextProps, nextState) {
        return true;
    }

    componentWillUpdate(nextProps, nextState) {
    }

    componentDidUpdate(prevProps, prevState) {
    }

    componentWillUnmount() {
    }
}

reactMixin.onClass(Paymanagesub, Reflux.connect(Store));

module.exports = Paymanagesub;
